﻿@{
	ViewBag.Title = "往来单位管理";
}

@section header {
}
@section quickmenu {
	<td style="padding-right: 0px; padding-left: 10px;">
		<span style="cursor: pointer;" title="新建..." @@click="listAdd">
			<i class="icon-plus icon-2x pull-left icon-border crm-bu-style"></i>
		</span>
	</td>
	<td style="padding-right: 0px; padding-left: 10px;">
		<span style="cursor: pointer;" title="查找..." @@click="searchToggle">
			<i class="icon-search icon-2x pull-left icon-border crm-bu-style"></i>
		</span>
	</td>
	<td style="padding-right: 0px; padding-left: 10px;">
		<span style="cursor: pointer;" title="从Excel文件导入..." onclick="orgImportOpen();"><i class="icon-upload icon-2x pull-left icon-border crm-bu-style"></i></span>
	</td>
	<td style="padding-right: 0px; padding-left: 10px;">
		<span style="cursor: pointer;" title="导出..." onclick="exportAll();"><i class="icon-download icon-2x pull-left icon-border crm-bu-style"></i></span>
	</td>
}

@*页面视图列表开始*@
<table class="list_table table100 fast-filter">
	<tbody>
		<tr>
			<td style="">
				<i class="icon-filter pure-icon-bu"></i>类型: <span style="padding-right: 5px; ">
					&nbsp;&nbsp;<a class="tablink" :class="{'cus_markbai':!listConditions.type||listConditions.type=='0','cus_markhui':listConditions.type&&listConditions.type!='0'}" href="javascript:void(0);" @@click="listFastFilter($event)" data-ftype="reset" data-fname="type">不限</a>&nbsp;&nbsp;
					<a class="tablink" :class="{'cus_markbai':listConditions.type=='@((int)PartnerType.布行)','cus_markhui':listConditions.type!='@((int)PartnerType.布行)'}" href="javascript:void(0);" @@click="listFastFilter($event)" data-fname="type" data-fvalue="@((int)PartnerType.布行)">客户</a>&nbsp;&nbsp;
				</span>
			</td>
		</tr>
	</tbody>
</table>
@*页面视图列表结束*@
<form id="searchFrm">
	<div style="width:100%;overflow:auto;">
		<table style="width:100%;border-collapse:collapse;border:none;table-layout:fixed;">
			<tr>
			@* 	<td align="left" valign="top" style="width:18%;">
					<table class="small table100 padding3">
						<tr>
							<td class="dvtTabCache" style="width: 10px" nowrap>
								&nbsp;
							</td>
							<td class="tab-chan-link tab-chan-link-on" style="width: 100%; text-align: center;"
								nowrap>
								分类
							</td>
							<td class="dvtTabCache">
								&nbsp;
							</td>
						</tr>
					</table>
					<div id="catTreeDiv" style="display: block; padding: 0 10px;">
						<ul id="catTree" class="ztree" style=""></ul>
					</div>
				</td> *@
				<td align="left" valign="top" style="border-left: 2px dashed #cccccc;width:85%;">
					<div id="searchDiv" style="z-index: 1; display: block; position: relative; margin-top: 3px;" v-show="searchShow">
						<table class="small table100" align="left">
							<tbody>
								<tr>
									<td class="small" nowrap="" align="left" style="padding-left: 10px;">
										<span>名称</span>
										<input type="text" class="txtBox" style="width: 150px" v-model.trim="listConditions.name">
										<span>编码</span>
										<input type="text" class="txtBox" style="width: 150px" v-model.trim="listConditions.code">
										<span>联系人</span>
										<input type="text" class="txtBox" style="width: 90px" v-model.trim="listConditions.contactman">
										<span>联系电话</span>
										<input type="text" class="txtBox" style="width: 130px" v-model.trim="listConditions.contactphone">
										<button class="pure-button pure-button-edit" title="查找" @@click.prevent="listRefresh(1)">
											<i class="icon-search"></i>查找
										</button>
										&nbsp;
										<button class="pure-button pure-button-cancel" title="取消" @@click.prevent="searchReset">
											<i class="icon-rotate-left"></i>重置
										</button>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<table class="lvt small table100">
						<tr>
							<td style="" align="left" nowrap>
								<button class="pure-button pure-button-edit" @@click.prevent="listAdd">
									<i class="icon-plus"></i>&nbsp;新增
								</button>
								&nbsp;
								<button class="pure-button pure-button-danger" @@click.prevent="listBatchDelete">
									<i class="icon-trash"></i>&nbsp;批量删除
								</button>
								&nbsp;
								<button class="pure-button pure-button-share" onclick="togglePanelR(this,'divExport');return false;"
										onmouseout="hidePanel('divExport')">
									<i class="icon-download"></i>&nbsp;导出
								</button>
								&nbsp;
								<div id="divExport" class="list-bulk-div" onmouseout="hidePanel('divExport')" onmouseover="showPanel('divExport')">
									<div onclick="exportAll();">
										<i class="icon-download" style="padding: 0px 10px;"></i>导出全部
									</div>
									<div class="list-bulk-link" onclick="exportCurrent();">
										<i class="icon-cloud-download" style="padding: 0px 10px;"></i>导出当前页
									</div>
									<div onclick="exportSelected();">
										<i class="icon-download" style="padding: 0px 10px;"></i>导出选中
									</div>
								</div>
							</td>
							<td nowrap align="right" valign="middle">
								<table border="0" cellspacing="0" cellpadding="0" class="small">
									<tbody>
										<tr>
											<td style="padding-right: 5px">
												<vue-pagination :total="listData.total" :psize="listData.psize" :pnum="listData.pnum" @@change="pageChangeHandler"></vue-pagination>
											</td>
										</tr>
									</tbody>
								</table>
							</td>
						</tr>
					</table>
					<table class="crm-table table100 padding2" cellspacing="1" cellpadding="3">
						<caption v-show="listData.list.length==0">
							暂无数据
						</caption>
						<tr class="windLayerHead">
							<td style="width: 20px;">
								<input type="checkbox" name="selectall" @@click="listToggle($event)" v-model="listData.checked" />
							</td>
							<td v-for="(col,idx) in listColumns" :style="col.hdStyles">
								<a class='listFormHeaderLinks' @@click="listSort(col.name)" v-if="col.sort">{{col.title}}<i :class="{'icon-caret-up':listSortColumn.order=='asc','icon-caret-down':listSortColumn.order=='desc'}" v-if="col.name==listSortColumn.name"></i></a>
								<span v-else>{{col.title}}</span>
							</td>
							<td nowrap style="width: 120px;">
								操作
							</td>
						</tr>
						<tr v-for="(item,idx) in pageList" :rid="item.ID" :class="{'crm-table-plural':idx%2==1}" style="cursor: pointer;">
							<td>
								<input type="checkbox" name="rowid" :value='item.ID' :data-idx="idx" @@click="listCheck($event)" :checked="item.CheckedState" />
							</td>
							<td v-for="(col,cidx) in listColumns" :style="item.Styles[cidx]">
								<span v-if="col.format" v-html="col.format(item[col.name],item)"></span>
								<a :href="item.Links[cidx].href" v-else-if="item.Links[cidx].href">{{item[col.name]}}</a>
								<span v-else>{{item[col.name]}}</span>
							</td>
							<td nowrap>
								<i class="icon-edit pure-icon-bu crm-bu-style list-action-btn" title='修改' style="" @@click="listEdit(item)"></i>
								<i class="icon-trash pure-icon-bu crm-bu-style list-action-btn" title='删除' style="" @@click="listDelete(item)"></i>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
</form>
@*生成列表操作*@
<sys-enumcode-edit ref="cat_edit" :visible="popid=='cat_edit'" :cls="catCls" :model="catData" @@complete="handleCatComplete" :vresult="catValidate" vname="catValidate"></sys-enumcode-edit>
@section footer {
	<script src="~/js/related/sys_enumcode_edit.js" asp-append-version="true"></script>
	@*日期必须开始*@
	<script src="~/lib/laydate/laydate.js" asp-append-version="true"></script>
	@*日期必须结束*@
	@*验证开始*@
	<script src="~/lib/validationEngine/jquery.validationEngine.min.js" asp-append-version="true"></script>
	<script src="~/lib/validationEngine/jquery.validationEngine-zh_CN.js" asp-append-version="true"></script>
	<link href="~/lib/validationEngine/validationEngine.jquery.css" rel="stylesheet" asp-append-version="true" />
	@*验证结束*@
	<link href="~/lib/ztree/ztree.css" rel="stylesheet" asp-append-version="true" />
	<script src="~/lib/ztree/ztree.core-3.5.37.min.js" asp-append-version="true"></script>
	<script src="~/lib/ztree/ztree.exedit-3.5.37.js" asp-append-version="true"></script>
	@*列表相关开始*@
	<script type="text/javascript">
		var listConditionsInit = { state: "" };//初始查询条件
		var pageEnumData = {
			type:@(Json.Serialize(ViewBag.TypeOptions)),
			state:@(Json.Serialize(ViewBag.StateOptions)),
		};
		var pageData = {
			hideBreadcrumb: false,
			serviceCode: '@(ViewBag.ServiceCode)',
			global: globalData,
			popid: "",
			catCls:'cat-edit',
			catData: {},
			catValidate: false,
			listData: {
				checked:false,
				list: [],
				total: 0,
				pnum: 1,
				psize:20,
			},
			listColumns: [
				{
					title: "类型",
					name: "Type",
					hdStyles: {
						width: "60px",
						textAlign:"center"
					},
					bdStyles: {
						textAlign:"center"
					}
				},
				{
					title: "往来单位名称",
					name: "Name",
					sort: true,
					href:"@(Url.Action("ViewDetail", "Partner"))/{ID}",
					hdStyles: {
						width: "120px",
					},
					bdStyles: {
					}
				},
				{
					title: "往来单位编码",
					name: "Code",
					sort: true,
					href:"@(Url.Action("ViewDetail", "Partner"))/{ID}",
					hdStyles: {
						width: "160px",
					},
					bdStyles: {
					}
				},
				{
					title: "联系人",
					name: "ContactMan",
					hdStyles: {
						width: "60px",
					},
					bdStyles: {
					}
				},
				{
					title: "联系电话",
					name: "ContactPhone",
					hdStyles: {
						width: "80px",
					},
					bdStyles: {
					}
				},
				{
					title: "联系地址",
					name: "Location",
					hdStyles: {
						width: "210px",
					},
					bdStyles: {
					},
					format: function (val, item) {
						return [item.Province, item.City, item.District, item.Town, item.Location].join('-');
					}
				},
				{
					title: "电话",
					name: "Phone",
					hdStyles: {
						width: "75px",
					},
					bdStyles: {
					}
				},
				{
					title: "传真",
					name: "Fax",
					hdStyles: {
						width: "75px",
					},
					bdStyles: {
					}
				},
				{
					title: "创建时间",
					name: "AddDate",
					hdStyles: {
						width: "110px",
					},
					bdStyles: {
					}
				}
			],
			searchShow:true,
			listConditions: Object.assign({}, listConditionsInit),
			listSortColumn: {
				name: "",
				order:""
			},
			listStyles: {
			},
			catModel: {},
		};

		var pageApp = new Vue({
			el: '#app',
			data: pageData,
			mounted: function () {
				this.listConditions = Object.assign({},this.listConditions, utils.pageRestore());
				this.listRefresh();
				this.catRefresh();
			},
			methods: {
				pageChangeHandler: function (args) {
					this.listRefresh(args.pnum, args.psize)
				},
				listFastFilter: function (e) {
					var obj = e.srcElement || e.target;
					switch (obj.dataset.ftype) {
						case "reset":
							{
								if (obj.dataset.fname) {
									this.listConditions = Object.assign({}, this.listConditions,_defineProperty({}, obj.dataset.fname, obj.dataset.fvalue));
								}
								this.listRefresh(1);
							}
							break;
						default:
							{
								if (!obj.dataset.fname) {
									return;
								}
								this.listConditions = Object.assign({}, this.listConditions, _defineProperty({}, obj.dataset.fname, obj.dataset.fvalue));
								this.listRefresh(1);
							}
					}
				},
				listRefresh: function (pageNum, pageSize) {
					var _params = Object.assign({}, {
						pnum: pageNum || this.listData.pnum,
						psize: pageSize || this.listData.psize,
						sortorder: !this.listSortColumn.name ? "" : this.listSortColumn.name + "_" + this.listSortColumn.order
					}, this.listConditions);
					utils.pageStore(_params,pageNum,pageSize);
					var _this = this;
					utils.ajaxPost('@(Url.Action("Search", "Partner"))', _params, function (resp) {
						var list = resp.data.list.map(function (item) {
							return Object.assign({}, item, {
								CheckedState: false
							});
						});
						var newData = { list: list, total: resp.data.total, pnum: resp.data.pnum, psize: resp.data.psize ,checked:false};
						_this.listData = newData;
					}, function (err) {
					})
				},
				searchReset: function () {
					$('.fast-filter').find('.tablink[data-ftype="reset"]').each(function (idx, elem) {
						$(elem).parent('span').find('.tablink').removeClass('cus_markbai').addClass('cus_markhui');
						$(elem).removeClass('cus_markhui').addClass('cus_markbai');
					});
					this.listConditions = Object.assign({}, listConditionsInit);
					this.listSortColumn = {
						col: "",
						order: ""
					};
					this.listRefresh(1);
				},
				searchToggle: function () {
					this.searchShow = !this.searchShow;
				},
				listSort: function (col) {
					if (col != this.listSortColumn.name) {
						this.listSortColumn.order = "desc";
						this.listSortColumn.name = col;
					} else {
						this.listSortColumn.order = this.listSortColumn.order == "asc" ? "desc" : "asc";
					}
					this.listRefresh(1);
				},
				listToggle: function (e) {
					var checked = (e.srcElement || e.target).checked;
					this.listData.list=this.listData.list.map(function (item) {
						return Object.assign({}, item,{
							CheckedState: checked
						});
					});
				},
				listCheck: function (e) {
					var obj = e.srcElement || e.target;
					var checked = obj.checked;
					this.listData.list.splice(obj.dataset.idx, 1, Object.assign({}, this.listData.list[obj.dataset.idx], {
						CheckedState: checked
					}));
				},
				listAdd: function () {
					location.href = '@(Url.Action("Add", "Partner"))';
				},
				listEdit: function (item) {
					location.href = '@(Url.Action("Edit", "Partner"))/'+item.ID;
				},
				listDelete: function (item) {
					var _this = this;
					utils.confirm('确定要删除往来单位【' + item.Name +'】？', function () {
						utils.ajaxPost('@(Url.Action("Delete", "Partner"))', { id: item.ID }, function (resp) {
							utils.success("删除成功");
							_this.listRefresh();
						}, function (msg) {
							utils.alert(msg);
						});
					});
				},
				listBatchDelete: function () {
					var selected = this.listData.list.filter(function (item) {
						return item.CheckedState;
					});
					var ids = selected.map(function (item) {
						return item.ID;
					});
					if (!ids||ids.length == 0) {
						utils.alert('请先选择要删除的往来单位');
						return;
					}
					var _this = this;
					utils.confirm('确定要删除所选择的往来单位？', function () {
						utils.ajaxPost('@(Url.Action("BatchDelete", "Partner"))',  ids , function (resp) {
							utils.success("删除成功");
							_this.listRefresh();
						}, function (msg) {
							utils.alert(msg);
						});
					});
				},
				catRefresh: function () {
					utils.ajaxPost('@(Url.Action("GetTreeData", "Sys_EnumCode"))', { id:"@(ViewBag.PartnerCatEnumID)",code: "@(ViewBag.PartnerCatEnumCode)",orgid:"@(ViewBag.OrgID)" }, function (resp) {
						var data = resp.data || [];
						data.sort(function (a, b) {
							return a.Sort - b.Sort == 0 ? a.ID - b.ID : a.Sort - b.Sort;
						});
						var treeData = [];
						$.each(data, function (idx, item) {
							treeData.push(Object.assign({}, item, {
								id: item.ID.toString(),
								pId: item.PID.toString(),
								name: item.Name,
								code: item.Code,
								open: true
							}));
						});
						$.fn.zTree.init($("#catTree"), catTreeSetting, treeData);
					});
				},
				catAdd: function (treeNode) {
					this.catValidate = false;
					this.catData = { PName: treeNode.name ||"@(ViewBag.PartnerCatEnumName)", PID: treeNode.id||"@(ViewBag.PartnerCatEnumID)" };
					this.popid = 'cat_edit';
					utils.layerOpen('.' +this.catCls, '620px');
				},
				catEdit: function (treeNode) {
					var self = this;
					utils.ajaxPost('@(Url.Action("EditJson", "Sys_EnumCode"))', { id: treeNode.id}, function (resp) {
						self.catValidate = false;
						self.catData = resp.data;
						self.popid = 'cat_edit';
						utils.layerOpen('.' +self.catCls, '620px');
					}, function (msg) {
						utils.alert(msg);
					});
				},
				handleCatComplete: function (e) {
					var self = this;
					if (e.result == "SUBMIT") {
						utils.ajaxPost('@(Url.Action("Save", "Sys_EnumCode"))', e.model, function (resp) {
							self.popid = '';
							layer.closeAll('page');//todo:
							self.catRefresh();
						}, function (msg) {
							self.catValidate = false;
							utils.alert(msg);
						});
					} else {
						layer.closeAll('page');//todo:
						this.popid = '';
					}
				},
			},
			computed: {
				pageList: function () {
					var _this = this;
					return this.listData.list.map(function (item) {
						return Object.assign({}, item, {
							Type: _this.$options.filters.formatType(item.Type),
							Styles: _this.listColumns.map(function (col) {
								return Object.assign({}, col.bdStyles, _this.listStyles[col.name] ? _this.listStyles[col.name][item[col.name]] : {})
							}),
							Links: _this.listColumns.map(function (col) {
								return Object.assign({}, { href: col.href ? col.href.replace(/{ID}/g, item.ID) : "" });
							}),
						});
					});
				},
				currentM: function () {
					var currentM = null;
					var i;
					var j;
					for (i = 0; i < this.global.modules.length; i++) {
						for (j = 0; j < this.global.modules[i].Services.length; j++) {
							if (this.serviceCode == this.global.modules[i].Services[j].Code) {
								currentM = this.global.modules[i];
								break;
							}
						}
					}
					return currentM;
				},
				currentS: function () {
					var currentS = null;
					var i;
					var j;
					for (i = 0; i < this.global.modules.length; i++) {
						for (j = 0; j < this.global.modules[i].Services.length; j++) {
							if (this.serviceCode == this.global.modules[i].Services[j].Code) {
								currentS = this.global.modules[i].Services[j];
								break;
							}
						}
					}
					return currentS;
				}
			},
			filters: {
				formatType: function (val) {
					return utils.formatEnum(val, pageEnumData.type);
				}
			}
		});

		$(function () {
			if(isMobile())
			{
				window.location.href="@Url.Action("MobileList", "Partner")";
			}
		});

		function isMobile() {
		  const regExp = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
		  return regExp.test(navigator.userAgent);
		}
	</script>
	@*列表相关结束*@
	@*分类相关开始*@
	<script type="text/javascript">
		var catTreeSetting = {
			view: {
				addHoverDom: function(treeId, treeNode) {
					var sObj = $("#" + treeNode.tId + "_span");
					if (treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
					var addStr = "<span class='button add' id='addBtn_" + treeNode.tId + "' title='新增下级' onfocus='this.blur();'></span>";
					sObj.after(addStr);
					var btn = $("#addBtn_" + treeNode.tId);
					if (btn) btn.bind("click", function () {
						pageApp.catAdd(treeNode);
						return false;
					});
				},
				removeHoverDom: function (treeId, treeNode) {
					$("#addBtn_" + treeNode.tId).unbind().remove();
				},
				selectedMulti: false
			},
			edit: {
				enable: true,
				removeTitle: "删除",
				renameTitle: "修改"
			},
			data: {
				simpleData: {
					enable: true
				}
			},
			callback: {
				onClick: function (event, treeId, treeNode, clickFlag) {
					var catids = treeNode.ID && treeNode.getParentNode() ? [treeNode.ID].concat((treeNode.children || []).map(function (c) {
						return c.ID;
					})) : [];
					pageApp.listConditions = Object.assign({}, pageApp.listConditions, {
						catid: catids.join(',')
					});
					pageApp.listRefresh(1);
				},
				onDblClick: function (event, treeId, treeNode, clickFlag) {
					pageApp.catEdit(treeNode);
				},
				beforeDrag: function (treeId, treeNodes) {
					if (!treeNodes[0].id || treeNodes[0].id == '0') {
						return false;
					}
				},
				beforeDrop: function (treeId, treeNodes, targetNode, moveType) {
					var canDrop = !(targetNode == null || (moveType != "inner" && !targetNode.parentTId));
					if (canDrop && (treeNodes[0].pId != targetNode.pId || moveType == "inner")) {
						var pid;
						switch (moveType) {
							case "inner":
								pid = targetNode.id;
								break;
							default:
								pid = targetNode.pId;
						}
						utils.ajaxPost('@(Url.Action("SetParent", "Sys_EnumCode"))', { id: treeNodes[0].id, pid: pid });
					}
					return canDrop;
				},
				onDrop: function (event, treeId, treeNodes, targetNode, moveType, isCopy) {
					if (!moveType || !targetNode) {
						return;
					}
					var ids = targetNode.getParentNode().children.map(function (item,idx) {
						return { id: item.id, order: idx };
					});
					utils.ajaxPost('@(Url.Action("SetOrder", "Sys_EnumCode"))',  ids , function (resp) {
						pageApp.catRefresh();
					}, function (msg) {
						utils.alert(msg);
						pageApp.catRefresh();
					});
				},
				beforeEditName: function (treeId, treeNode) {
					pageApp.catEdit(treeNode);
					return false;
				},//修改事件
				beforeRemove: function (treeId, treeNode) {
					utils.confirm('确定删除[' + treeNode.name + ']？', function () {
						utils.ajaxPost('@(Url.Action("Delete", "Sys_EnumCode"))', { id: treeNode.id }, function (resp) {
							pageApp.catRefresh();
						}, function (msg) {
							utils.alert(msg);
						});
					});
					return false;
				},//删除事件
			}
		};
	</script>
	@*分类相关结束*@
	<script type="text/javascript">
		$(document).ready(function () {
			$("form.validation-engine").validationEngine({
				scroll: false,
				validateNonVisibleFields: false,
				autoHidePrompt: true,
				showOneMessage: true,
				ajaxFormValidationMethod: 'post',
				promptPosition: 'bottomLeft',
				onValidationComplete: function (form, status) {
					if (!status) {
						return;
					}
					var validateResult = form[0].dataset.validate;
					if (validateResult) {
						pageApp[validateResult] = true;
					}
				}
			});
		});
	</script>
	@*导出相关开始*@
	<script type="text/javascript">
		function orgImportOpen() {
			var uploadurl = '@(Url.Action("ImportExcel", "Partner"))';
			layer.open({
				type: 2,
				title: '往来单位信息导入',
				shadeClose: false,
				shade: [0.3, '#000'],
				//maxmin: true, //开启最大化最小化按钮
				area: ['800px', '380px'],
				content: uploadurl + (uploadurl.indexOf('?') < 0 ? '?' : '&') + 'callback=orgImportCallback&nc=' + new Date().getTime()
			});
		}

		function orgImportCallback() {
			pageApp.listRefresh(1);
			catRefresh();
		}

		function getSelectedIDs() {
			var selected = pageApp.listData.list.filter(function (item) {
				return item.CheckedState;
			});
			var ids = selected.map(function (item) {
				return item.ID;
			});
			return ids;
		}

		function getCurrentPageIDs() {
			var ids = pageApp.listData.list.map(function (item) {
				return item.ID;
			});
			return ids;
		}
	</script>
	@*导出相关结束*@
}